<template>
	<view class="searchaddress">
		<uni-navbar v-on:clickLeft="clickBack()" leftIcon="back" shadow="false" leftText="上海" rightText="取消">
			<input class="search-val" type="text" v-model="keyword" slot="title" maxlength="50" cursor-spacing="20" focus
			 confirm-type="done" placeholder="填写小区/写字楼" />
		</uni-navbar>
		<view class="result">
			<view class="result-list" v-for="(result,index) in resultList" :key="index" @tap="chooseThisAddress(result)">
				<view class="build">
					{{result.title}}
				</view>
				<view class="street-number">
					{{result.details}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uniNavbar from '@/components/uni-nav-bar/index.vue'
	import initloaction_api from '@/api/map/init.js'
	export default {
		data() {
			return {
				keyword: '',
				resultList: [],
				backurl: ''
			}
		},
		components: {
			uniNavbar
		},
		onLoad: function(options) {
			// let backurl = options.backurl || '../../pages/tabBar/index'
			// this.backurl = backurl;
		},
		methods: {
			searchAddress() {
				let _this = this
				_this.resultList = []

				let search = {
					keyword: _this.keyword,
					city: '上海',
					pagesize: 8,
					success(suggestionList) {
						_this.resultList = suggestionList
					},
					fail() {
						_this.resultList = []
						uni.showToast({
							title: '未匹配到地址信息'
						})
					},
					complete() {

					}
				}
				initloaction_api.getSuggestion(search)
			},
			chooseThisAddress(addr) {
				let _this = this
				initloaction_api.reverseGeocoder(addr, () => {
					let result = JSON.stringify(addr);
					let pages = getCurrentPages();
					if(!pages || pages.length<=1 ){
						uni.switchTab({
							url:"/pages/tabBar/index"
						})
						return ;
					}
					//当前页面
					let currPage = pages[pages.length - 1];
					//将数据传输到上一个页面 
					let prevPage = pages[pages.length - 2];
					this.$tempaddress.commit('setTemp',{
						city: '上海',
						AddressAuto: addr.details,
						AutoBuilding: addr.title,
						Lat: addr.lat,
						Lng: addr.lng,
						area: addr.district,
						province: addr.province,
					})
					uni.navigateBack();
				})
			},
			clickBack() {
				uni.navigateBack();
			}
		},
		watch: {
			keyword: function(val) {
				if (val.length > 0) this.searchAddress();
				else this.resultList = [];
			}
		}
	}
</script>

<style lang="scss" scoped="">
	.searchaddress {
		height: 100vh;
	}

	.search-val {
		width: 90%;
		height: 60upx;
		line-height: 60upx;
		margin-top: 14upx;
		background-color: #f4f4f4;
		padding-left: 20upx;
		padding-right: 10upx;
		color: #333333;
		font-size: 28upx;
	}

	.result {
		height: 98%;
		padding: 40upx 0 40upx 2%;
		margin-bottom: 50upx;

		.result-list {
			margin-bottom: 20upx;
			border-bottom: 1px solid #f4f4f4;

			.build {
				line-height: 48upx;
				font-size: 28upx;
				font-weight: 600;
				color: #000;
			}

			.street-number {
				font-size: 24upx;
				color: #999;
				line-height: 60upx;
			}
		}
	}
</style>
